<template>
  <div class="sidebar">
    <div class="left">
      <!-- 侧边栏组件 -->
    
    <el-menu
      router
      unique-opened
      :default-active="activeIndex"
      class="el-menu-vertical-demo"
      @open="handleOpen"
      @close="handleClose">
      <el-submenu index="memberAdmain">
        <template slot="title">
          <i class="el-icon-folder-opened"></i>
          <span>成员管理</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="/memberAdmain/hostAdmain"> <i class="el-icon-document"></i> 主持人管理</el-menu-item>
          <el-menu-item index="/memberAdmain/weddingAdmain"><i class="el-icon-document"></i>婚庆公司管理</el-menu-item>
          <el-menu-item index="/memberAdmain/newAdmain"><i class="el-icon-document"></i>新人管理</el-menu-item>
        </el-menu-item-group>
      </el-submenu>
      <el-submenu index="memberOrder">
        <template slot="title">
          <i class="el-icon-folder-opened"></i>
          <span>成员订单中心</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="/memberOrder/hostOrder"><i class="el-icon-document"></i>主持人订单中心</el-menu-item>
        </el-menu-item-group>
      </el-submenu>
      <el-submenu index="contentAdmain">
        <template slot="title">
          <i class="el-icon-folder-opened"></i>
          <span>内容管理</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="/contentAdmain/bannerAdmain"><i class="el-icon-document"></i>bannner管理</el-menu-item>
          <el-menu-item index="/contentAdmain/homeAdmain"><i class="el-icon-document"></i>首页推荐管理</el-menu-item>
          <el-menu-item index="/contentAdmain/bottomCopy"><i class="el-icon-document"></i>底部文案、二维码设置</el-menu-item>
          <el-menu-item index="/contentAdmain/cooperationAdmain"><i class="el-icon-document"></i>合作伙伴管理</el-menu-item>
          <el-menu-item index="/contentAdmain/joinCopy"><i class="el-icon-document"></i>加入团队介绍文案</el-menu-item>
          <el-menu-item index="/contentAdmain/aboutCopy"><i class="el-icon-document"></i>关于团队介绍文案</el-menu-item>
        </el-menu-item-group>
      </el-submenu>
      <el-submenu index="otherAdmain">
        <template slot="title">
          <i class="el-icon-folder-opened"></i>
          <span>其他管理</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="/otherAdmain/admain"><i class="el-icon-document"></i>管理员配置</el-menu-item>
          <el-menu-item index="/otherAdmain/hostSet"><i class="el-icon-document"></i>主持人等级设置</el-menu-item>
          <el-menu-item index="/otherAdmain/admainFee"><i class="el-icon-document"></i>管理费记录</el-menu-item>
        </el-menu-item-group>
      </el-submenu>
      <el-submenu index="wxExplain">
        <template slot="title">
          <i class="el-icon-folder-opened"></i>
          <span>微信绑定说明</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="/wxExplain/sendInfo"><i class="el-icon-document"></i>推送消息 流程说明</el-menu-item>
          <el-menu-item index="/wxExplain/wxHtml"><i class="el-icon-document"></i>微信绑定账号页面</el-menu-item>
          <el-menu-item index="/wxExplain/infoModule"><i class="el-icon-document"></i>消息模板--订单模板 下单、取消订单</el-menu-item>
          <el-menu-item index="/wxExplain/bindInfo"><i class="el-icon-document"></i>绑定成功、取消绑定通知</el-menu-item>
        </el-menu-item-group>
      </el-submenu>
    </el-menu>
  
    </div>

    <div class="right">
      <router-view/>
    </div>
  </div>
</template>

<script>
export default {
    name:'Sideba',
    data(){
      return{
        activeIndex:'/'
      }
    },
     methods: {
      handleOpen(key, keyPath) {
        // console.log(key, keyPath);
      },
      handleClose(key, keyPath) {
        // console.log(key, keyPath);
      }
    }
}
</script>

<style scoped lang='less'>
.sidebar{
  display: flex;
  margin-top: 10px;

  .left{
    width: 300px;
    text-align: left;

    ul{
      border: 0px;
    }
  }

  .right{
    width: 100%;
    background-color: #fff;
  }
}
</style>